<template>
  <div class="hello">
    <h1>{{ msg }}</h1>
    <hr>
    <div>num: {{ num }}</div>
    <div>count: {{ count }}</div>  
    <div @click="count++">count: {{ count }}</div>  
    <div @click="clickHandler">count: {{ count }}</div>  
    
    


  </div>
</template>

<script>
import { ref } from 'vue'
export default {
  name: "HelloWorld",
  props: {
    msg: String,
  },
  // vue3写法
  setup() {
    // console.log('setup',this);
    let num = ref(6)
    let abc = ref(5)
    console.log(num);
    console.log(abc);

    const xxx = () => {
      console.log(999);

      abc.value += 2
    }

    return {
      num,
      count:abc,
      clickHandler: xxx
    }

  }
}
</script>

<style scoped >

</style>